<template>
	<view>
		<UserInfoCard></UserInfoCard>
		<view class='pad-16r'>

			<view class=" item">
				<view class="between-center">
					<view class="border-col font-weight">住院人信息</view>
					<view class="status-1" v-if="item.status==1">已出院</view>
					<!-- <view class="status-0" v-else>未出院</view> -->
				</view>
				<view>
					<view class="start-center">
						<view class="item-title">住院患者</view>
						<view>{{item.patName}}</view>
					</view>
					<view class="start-center">
						<view class="item-title">住院号</view>
						<view>{{item.medicalRecordNo}}</view>
					</view>
					<view class="start-center">
						<view class="item-title">床位号</view>
						<view>{{item.bedNo}}</view>
					</view>
					<view class="start-center">
						<view class="item-title">住院院区</view>
						<view>{{item.campusName}}</view>
					</view>
					<view class="start-center">
						<view class="item-title">住院科室</view>
						<view>{{item.departmentName}}</view>
					</view>
					<view class="start-center">
						<view class="item-title">入院日期</view>
						<view>{{item.inHospitalTime}}</view>
					</view>
					<view class="start-center">
						<view class="item-title">出院日期</view>
						<view>{{item.leaveHospitalTime}}</view>
					</view>
					<view class="start-center">
						<view class="item-title">住院天数</view>
						<view>{{inHospitalDay}} 天</view>
					</view>
				</view>
			</view>
			<view class="item">
				<view class="border-col font-weight">出院带药信息</view>
				<view class="between-center mar-10-0">
					<view class="list-name">项目名称</view>
					<view class="around flex-1">
						<view>数量</view>
						<view class=" list-use">用法用量</view>
					</view>
				</view>
				<view v-for="(child,index) in item.medicationList" :key="index">
					<view class="between-center mar-10-0">
						<view class="list-name  color-gray">{{child.name}}</view>
						<view class="around flex-1">
							<view class="text-center">X{{child.num}}</view>
							<view class="list-use">{{child.use}}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="item">
				<view class="border-col">注意事项</view>
				<view>
					<text>
						{{item.precautions}}
					</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import UserInfoCard from '../../../components/UserInfo/UserInfoCard.vue'
	import FilterButton from '../../../components/FilterButton/FilterButton.vue'
	import {
		getDaysBetweenDates
	} from '../../../utils/assist'
	export default {
		components: {
			UserInfoCard,
			FilterButton
		},
		computed: {
			inHospitalDay() {
				return getDaysBetweenDates(this.item.inHospitalTime, this.item.leaveHospitalTime)
			}
		},
		onLoad(e) {
			this.item = JSON.parse(e.item)
		},
		data() {
			return {
				item: {}
			}
		},
		methods: {

		}
	}
</script>

<style lang='scss' scoped>

	.list-name {
		width: 30%;
	}

	.list-use {
		width: 50%;
	}

	.status-0 {
		background: #eba242;
		padding: 3px 10px;
		border-radius: 16rpx;
		color: white;
	}

	.status-1 {
		background: #0cbd30;
		padding: 3px 10px;
		border-radius: 16rpx;
		color: white;
	}
</style>